import React, { Component } from 'react'
/*
  高阶组件HOC:本质就是个高阶函数，接收一个组件为参数，运行的时候会给这个组件添加一些附加功能/属性，
          返回一个新的组件（复用 功能逻辑）（参数是函数 返回值是函数）
  高阶函数:一个函数接收一个函数为参数，返回新的组件
  修饰者模式:不改变原有对象的前提下，给这个对象添加一些附加功能
  2.常见的高阶函数: 
    1)定时器设置函数
    2)数组的forEach()/map()/filter()/reduce()/find()/bind()
    3)promise
    4)react-redux中的connect函数
*/
//高阶组件方法
function HocCom(Com) {
  return class HocCom extends Component {
    comFn = () => {
      console.log('高阶组件，，，，，，')
    }
    //返回新的组件Com
    render() {
      return <Com comFn={this.comFn}></Com>
    }
  }
}
//调用
class List extends Component {
  render() {
    let { comFn } = this.props
    return (
      <div>
        <button onClick={comFn}>调用高阶组件</button>
      </div>
    )
  }
}
export default HocCom(List)
